<template>
  <div id="app">
    <h1>黑马头条</h1>
    <i class="toutiao toutiao-shouye"></i>
    <van-button type="primary">主要按钮</van-button>
    <van-button type="info">信息按钮</van-button>
    <van-button type="default">默认按钮</van-button>
    <van-button type="warning">警告按钮</van-button>
    <van-button type="danger">危险按钮</van-button>
    <!-- <div style="font-size:32px">字体</div> -->
    <div class="font-demo">字体</div>
    <router-view />
  </div>
</template>

<script>
//  1. 在通过vscode开启项目时，一定要把更目录设置为项目文件夹 （如果不这样设置，可能自动格式化会失效）
//  2. 虽然设置了通过eslint配置自动格式化插件，但是希望各位可以慢慢的脱离该插件

//  postcss-pxtorem 插件只能修改内部样式表 外部样式表中的px 不可修改行内样式标中的px设置 => 在移动端布局时, 基本上使用内部样式表 外部样式表来设置
// 当需要固定某个纵坐标高度时, 可以使用行内样式表

export default {
  name: 'App',
  data () {
    return {
      name: 'lbw',
      age: 25
    }
  }
}
</script>

<style lang="less" scoped>
  .font-demo {
    font-size: 32px;
  }
</style>
